#@head() 
#@header()
<title>报表</title>
#@aside("datanalysis")
<script type="text/javascript" src="#(path)/assets/js/jquery.tmpl.min.js"></script>
<style>
	.box-body{padding:5px !important}
</style>
<div class="content-wrapper">
	<section class="content">
	<div class="nav-tabs-custom"> 
		<ul class="nav nav-tabs">
			<li class="active"><a id="reportname" style="cursor:pointer;" ></a></li> 
		</ul>
		<div class="tab-content">
			<div class="tab-pane active" id="tab_1">
				<div class="input-group " style="width:100%;float:left">
					<div id="searchs" style="float:left">
						
					</div>
					<span style="float:left;margin-left:20px;" class="input-group-btn"> 
					  <button id="seachuser" type="button" class="btn btn-info btn-flat">搜索</button>
					</span>
					<span style="float:left;margin-left:60px;" class="input-group-btn"> 
					  <button id="download" type="button" class="btn btn-info btn-success">下载</button>  
					</span>
				</div>
				<div class="box-body">
					<table  id="example1" class="table table-striped">
						<thead>
							<tr id="title1" >
								
							</tr>
						</thead>
						<tbody id="search_info">
							
						</tbody>
					</table>
					<div class="box-footer clearfix">
					  <ul class="pagination pagination-sm no-margin pull-right">
						<li id="userlist1"><a href="#">首页</a></li>
						<li id="userlist2"><a href="#">上一页</a></li>
						<li><a href="#">第<span id="userlist5"></span>页 共<span id="userlist6"></span>页</a></li>
						<li id="userlist3"><a href="#">下一页</a></li>
						<li id="userlist4"><a href="#">尾页</a></li>
					  </ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	</section>
</div>
#@footer()

<script>
 $(document).ready(function(){
	var init = false;
	var id = GetRequest().id;
	var totalPage = 1;
	var pageNumber = 1;
	var itemnum = 0;
	var addurl = "";
	var searcharray =new Array();
	var reporttitles =new Array();
	$("#userlist").empty();
	userlist(pageNumber,addurl);
	$("#userlist5").html(pageNumber);
	$("#userlist1").click(function(){
		$("#search_info").empty();
		pageNumber = 1;
		userlist(pageNumber,addurl);
		$("#userlist5").html(pageNumber);
	});
	$("#userlist2").click(function(){
		if(pageNumber==1){
			alert("当前页是首页!");
		}else{
			$("#search_info").empty();
			pageNumber = pageNumber-1;
			userlist(pageNumber,addurl);
			$("#userlist5").html(pageNumber);
		}
	});
	$("#userlist3").click(function(){
		if(pageNumber==totalPage){
			alert("当前页是尾页!");
		}else{
		$("#search_info").empty();
		pageNumber = pageNumber +1;
		userlist(pageNumber,addurl);
		$("#userlist5").html(pageNumber);
		}
	});
	$("#userlist4").click(function(){ 
		$("#search_info").empty();
		pageNumber = totalPage;
		userlist(pageNumber,addurl);
		$("#userlist5").html(pageNumber);
	});
	$("#seachuser").click(function(){ 
		addurl = "";
		$("#search_info").empty();
		pageNumber = 1; 
		$("#userlist5").html(pageNumber);
		$.each(searcharray, function(i, item){ 
			if(!$.isBlank(item)){
				addurl += "&"+item+"=" + $("#"+item).val();
			}
			console.log(item);
		});
		console.log(addurl);
		userlist(pageNumber,addurl);
	});
	function userlist(page,addurl){
		$.getJSON("/sqlReport/search?token=#(session.token??)&page="+page+"&size=12&id="+id+addurl, function(reportlist) {
			console.log(reportlist);
			var reportsql = reportlist.data.sql;
			if(!init){
				$("#reportname").html(reportsql.name);
				var reportsqls = JSON.parse(reportsql.params); 
				var onfocus = "";
				$.each(reportsqls, function(i, item){ 
					if(item.type=="date"){
						onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})"
					}
					searcharray[i] = item.field; //搜索字段数组
					if(item.type=="option"){ 
						var option1= item.options;
		
						var option2="<option value=''>全部</option>";
						$.each(option1, function(i, v){ 
							option2 += "<option value="+i+">"+v+"</option>";
						});
						$("#searchs").append("<label style='float:left;margin-top:8px;margin-left:5px;'>"+item.name+"：</label><select type='text' id='"+item.field+"' style='width:150px;margin-right:10px;' class='form-control' >"+option2+"</select>");

					}else{
						$("#searchs").append("<label style='float:left;margin-top:8px;margin-left:5px;'>"+item.name+"：</label><input type='text' id='"+item.field+"' onfocus='"+onfocus+"' style='width:150px;margin-right:10px;' class='form-control' >");
					}
					/*var reportsqllist = {onfocus:onfocus,name:item.name,field:item.field};
					$("#seachers").tmpl(reportsqllist).appendTo('#searchs');  */
				}); 
				$.each(reportsql.titles.split(","), function(i, item){ 
					$("#title1").append("<th>"+item+"</th>");
					itemnum = i++;
				});
				init = true; 
			}
			$.each(reportlist.data.list.list, function(i, item){ 
				var tr ="<tr>";
				$.each(reportsql.titles.split(","), function(i, item2){ 
					tr += "<td>"+item[item2]+"</td>";
				});
				tr = tr+"</tr>";
				$("#search_info").append(tr);
			});
			totalPage = reportlist.data.list.totalPage;
			$("#userlist6").html(totalPage);
		});	  
	}
	$("#download").click(function(){
		window.location.href="#(path)/sqlReport/download?token=#(session.token??)&id="+id+addurl;
	});
	function GetRequest() {  
	   var url = location.search; //获取url中"?"符后的字串  
	   var theRequest = new Object();  
	   if (url.indexOf("?") != -1) {  
		  var str = url.substr(1);  
		  strs = str.split("&");  
		  for(var i = 0; i < strs.length; i ++) {  
			 theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);  
		  }  
	   }  
	   return theRequest;   
	}  
});
   
</script> 


</body>
</html>

